import {ActionType, PageContainer, ProColumns, ProTable} from "@ant-design/pro-components";
import {Button, Switch, Tooltip} from "antd";
import React, {useRef} from "react";
import {CheckOutlined, CloseOutlined, SettingFilled, SolutionOutlined} from "@ant-design/icons";
import {globalLoadTableApi, handleGloblApi} from "@/services/admin-api/globalApi";
import {Order, orderStatus} from "@/pages/Order/Management";
import {history} from "@umijs/max";

export default () => {

  const actionRef = useRef<ActionType>();

  const columns: ProColumns<Order>[] = [
    {title: '订单ID', dataIndex: 'orderId', valueType: 'text', copyable: true, width: 135},
    {title: '名称', dataIndex: 'customerName', valueType: 'text'},
    {title: '电话', dataIndex: 'customerPhone', valueType: 'text', copyable: true, width: 120},
    {
      title: '状态',
      dataIndex: 'orderStatus',
      valueType: 'select',
      valueEnum: orderStatus,
    },
    {
      title: '调度状态',
      dataIndex: 'dispatchStatus',
      valueType: 'select',
      fieldProps: {options: [{label: '未完成', value: false}, {label: '已完成', value: true}]},
      hideInTable: true
    },
    {title: '时间', dataIndex: 'serviceTime', valueType: 'dateTime', hideInSearch: true,},
    {
      title: '服务时间', dataIndex: 'serviceTime', valueType: 'dateTimeRange', hideInTable: true, search: {
        transform: (value) => {
          return {serviceTimeStart: value[0], serviceTimeEnd: value[1],};
        },
      },
    },
    {title: '起点', dataIndex: 'startAddress', valueType: 'text'},
    {title: 'startAddressLng', dataIndex: 'startAddressLng', valueType: 'digit', hideInSearch: true,},
    {title: 'startAddressLat', dataIndex: 'startAddressLat', valueType: 'digit', hideInSearch: true,},
    {title: '新家', dataIndex: 'newAddress', valueType: 'text'},
    {title: 'newAddressLng', dataIndex: 'newAddressLng', valueType: 'digit', hideInSearch: true,},
    {title: 'newAddressLat', dataIndex: 'newAddressLat', valueType: 'digit', hideInSearch: true,},
    {
      title: '调度状态',
      dataIndex: 'dispatchStatus',
      valueType: 'select',
      render: (_, record) => <Switch
        size={"small"} checked={record.dispatchStatus} checkedChildren={<CheckOutlined/>}
        unCheckedChildren={<CloseOutlined/>}
        onChange={async (checked: boolean) => {
          const r = await handleGloblApi('/dispatch/modifyDispatchStatus', {
            orderId: record.orderId,
            dispatchStatus: checked
          })
          if (r) {
            actionRef.current?.reload()
          }
        }}/>,
      fieldProps: {options: [{label: '未完成', value: false}, {label: '已完成', value: true}]},
      hideInSearch: true
    },
    {title: '创建时间', dataIndex: 'createTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '创建用户ID', dataIndex: 'createUserId', valueType: 'digit', hideInSearch: true,},
    {title: '创建用户', dataIndex: 'createUserName', valueType: 'text', hideInSearch: true,},
    {title: '更新时间', dataIndex: 'updateTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '更新用户ID', dataIndex: 'updateUserId', valueType: 'digit', hideInSearch: true,},
    {title: '更新用户', dataIndex: 'updateUserName', valueType: 'text', hideInSearch: true,},
    {
      title: <SettingFilled/>,
      render: (_, record) => [
        <Tooltip title={"订单调度"} key={`dispatch_${record.orderId}`}>
          <Button
            size="small" icon={<SolutionOutlined/>} type="primary" onClick={() => {
            history.push(`/dispatch/order?orderId=${record.orderId}`)
          }}/>
        </Tooltip>,
      ],
      valueType: 'option',
    },
  ];

  return <PageContainer header={{title: '', breadcrumb: {},}}>
    <ProTable<Order>
      columns={columns} actionRef={actionRef} search={{span: 4}}
      form={{initialValues: {orderStatus: "2", dispatchStatus: false}}}
      request={async (param) => globalLoadTableApi('/dispatch/table', param)}
      rowKey={(record) => record.orderId}
      columnsState={{
        defaultValue: {
          startAddressLng: {show: false},
          startAddressLat: {show: false},
          newAddressLng: {show: false},
          newAddressLat: {show: false},
          delFlag: {show: false},
          createUserId: {show: false},
          createUserName: {show: false},
          createTime: {show: false},
          updateUserId: {show: false},
          updateTime: {show: false},
          updateUserName: {show: false},
        }
      }}/>
  </PageContainer>
}
